<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>大众点评首页</title>
    <link rel="stylesheet" type="text/css" href="/static/css/index.css">
    <style type="text/css">
        .cates{
            border: 0px red solid;
            color: white;
            margin: 13px 0px 10px 10px;

        }
        .cates a{
            color: white;
            font-size: 15px
        }
        .cates2 a{
            color: #ccc;
            font-size: 11px

        }
    </style>
</head>
<body>
 {include file="public/head"/}	
 <div class="fixed-card J-goverment" style="right: 0px;"></div>
    <div id='div1'>
		<span class='div1left'>
            {foreach $cates as $v}
                <div class="cates">
                    <a href="">{$v['pc_name']}</a>&nbsp;&nbsp;
                    {foreach $cates2 as $vo}
                        {if condition="$vo['pc_f_id']==$v['id']"}
                            <span class="cates2"><a href="">{$vo['pc_name']}</a>&nbsp;&nbsp;</span>
                        {/if}
                    {/foreach}
                </div>

            {/foreach} 
            
               
        </span>
		<span class='div1ctop'><img class="big" src="/static/img/div1ctop1.jpg" alt="" ></span>
             <div class="small">
                <span><img src="/static/img/div1ctop1.jpg" width="770px" style="display:none"/></span>
                <span><img src="/static/img/div1ctop2.jpg" width="770px" style="display:none"/></span>
                <span><img src="/static/img/div1ctop3.jpg" width="770px" style="display:none"/></span>
                <span><img src="/static/img/div1ctop4.jpg" width="770px" style="display:none"/></span>
             </div>
		<span class='div1cbot'></span>
		<span class='div1right'></span>
    </div>
    <div id='div2'>
    	<div class='div2left'>
    		<div class='div2ltop'></div>
    		<div class='div2lbot'>
                <span class='div2lb'></span>      
                <span class='div2lb'></span>      
                <span class='div2lb'></span>      
                <span class='div2lb'></span>      
                <span class='div2lb'></span>      
                <span class='div2lb'></span>  
            </div>
    	</div>
    	<div class='div2right'>
    		<div class='div2rtop'></div>
    		<div class='div2rbot'>
                <span class='div2rb'></span>      
                <span class='div2rb'></span>      
                <span class='div2rb'></span>      
                <span class='div2rb'></span>      
                <span class='div2rb'></span>      
                <span class='div2rb'></span>      
            </div>
    	</div>
    </div>
    <div id='div3'>
    	<div id='div3top'></div>
    </div>
    <div id='div4'>
    	<div class='div4top'></div>
    </div>
{include file="public/tail"/} 
<script type="text/javascript">
    console.log(Math.round(Math.random()*3))
    var b=document.getElementsByClassName("big")
    function test(n){
        b[0].src="/static/img/div1ctop"+Math.round(Math.random()*3)+".jpg";
    }
    setInterval(test,3000);
</script>
</body>
</html>